<template>
  <div class="search">
    <!-- navbar -->
    <!--    子组件-->
    <nav-bar @clickBarItem="clickBarMenuItem" :navBarItem="NavBarMenu"></nav-bar>
    <div class="title"></div>
    <router-view></router-view>
  </div>
</template>

<script>
import NavBar from "../../../components/NavBar/NavBar";

export default {
  name: "search",
  data() {
    return {
      //  搜索菜单导航栏
      NavBarMenu: [
        //this.$route.params.id 获取的当前路径中搜索的歌曲
        {name: '单曲', path: `/search/search-songs/${this.$route.params.id}`},
        {name: '歌手', path: `/search/search-singers/${this.$route.params.id}`},
        {name: '专辑', path: `/search/search-album/${this.$route.params.id}`},
        {name: '视频', path: `/search/search-video/${this.$route.params.id}`},
        {name: '歌单', path: `/search/search-music-list/${this.$route.params.id}`},
      ]

    }
  },
  methods:{
  //  子组件点击导航菜单时的回调
    clickBarMenuItem(path){
      /*
      path:回调传回路径
       */
      if(path!==this.$route.path){
        this.$router.push(path)
      }
      console.log(path)

    }
  },
  components: {
    NavBar,
  }
}
</script>

<style scoped lang="less">

</style>
